import styled from 'styled-components';

export const StyledDiv = styled.div`
  padding: 20px 40px 100px 40px;
  .header {
    width: 1230px;
    padding: 0 382px;
  }
  .title {
    text-align: center;
  }
  label {
    width: 132px;
    padding: 0 12px;
  }
  .common {
    display: flex;
    align-items: center;
    width: 380px;
  }
  .project {
    .ant-select {
      min-width: 233px;
      width: 100%;
    }
  }
  .athlete {
    position: relative;
    width: 380px;
    .ant-btn {
      position: absolute;
      right: -100px;
      top: 3px;
    }
    ${props =>
    props['project-a'] === '5' ? `.ant-input {
        flex-basis: content;
        &:last-child {
          margin-left: 4px;
        }
      }` : ''
  }
  }
  .draw-list {
    padding: 24px;
    display: flex;
    flex-wrap: wrap;
    max-width: 1230px;
    min-height: 245px;
    .draw {
      margin: 12px;
      display: flex;
      flex-direction: column;
      .ant-input {
        margin-top: 4px;
        color: red;
        font-weight: bold;
        font-size: 18px;
      }
    }
    .ant-btn, .ant-input {
      width: 171px;
    }
  }

`